<template>
  <div class="pdf">
    <vue-pdf-embed
      ref="pdfRef"
      :source="state.url"
      class="vue-pdf-embed"
      width="850"
      :page="state.pageNum"
    >
    </vue-pdf-embed>
  </div>
</template>

<script setup>
import VuePdfEmbed from "vue-pdf-embed";

import { ref, reactive, getCurrentInstance, onMounted } from "vue";
const { proxy } = getCurrentInstance();

const props = defineProps({
  url: {
    type: String,
  },
});
const state = ref({
  url: "",
  pageNum: 0,
  numPages: 0,
});
const pdfRef = ref();
const initPdf = async () => {
  state.value.url = "/api" + props.url;
};
onMounted(() => {
    initPdf();
});
</script>

<style lang="scss" scoped>
.pdf{
    width:100%;
}
</style>